.login{
    width: 100%;
    height: 100%;
    background-image: url(../../assets/loginbackground.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    perspective: 500px;
    .ledgerModel{
        width: 400px;
        height: 500px;
        border-radius: 20px;
        background-color: rgb(198, 198, 198);
        position: absolute;
        top: calc(50% - 250px);
        left: calc(50% - 200px);
        opacity: 0;
        transform: rotateY(0deg);
        transition: transform 0.8s linear 0s;
        .ledgerModel1st{
            transform:rotateY(180deg);
            width: 400px;
            height: 360px;
            background-color: rgb(228, 224, 224);
            overflow: auto;
        }
    }
    .loginModel{
        background-color: rgb(198, 198, 198);
        border-radius: 20px;
        border: rgb(198, 198, 198) 30px solid;
        position: absolute;
        top: calc(50% - 155px);
        left: calc(50% - 155px);
        opacity: 1;
        transform: rotateY(0deg);
        transition: transform 0.8s linear 0s;
        .loginForm{
            margin-top: 10%;
            margin-left: -20%;
        }
    }
}
.isInActive{
    display: none;
}
.isActive{
    display: block;
}
